<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Study | Bootstrap</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
</head>
<body>
    <button class="btn btn-primary">提交</button>
    <button class="btn btn-success">提交</button>
    <button class="btn btn-info">提交</button>
    <button class="btn btn-danger">提交</button>
    <button class="btn btn-waining">提交</button>
    <button class="btn btn-default">提交</button>
    <p class="glyphicon glyphicon-music"></p>

    <!--<div class="container-fluid">-->
        <!--<p style="background: red">123</p>-->
    <!--</div>-->

    <div class="container" style="margin-top: 30px">
        <div class="row">
            <div class="col-md-8">
                <p style="background: red">123</p>
            </div>
            <div class="col-md-4">
                <p style="background: red">123</p>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4">
                <p style="background: chartreuse">123</p>
            </div>
            <div class="col-md-8">
                <p style="background: chartreuse">123</p>
            </div>
        </div>
        <div class="table-responsive">
            <table class='table table-striped table-bordered table-hover table-hover'>
        <thead>
            <tr>
                <th>用户名</th>
                <th>密码</th>
            </tr>
        </thead>

        <tbody>
            <tr class='success'>
                <td>user</td>
                <td>pwd</td>
            </tr>

            <tr class="active">
                <td>user</td>
                <td>pwd</td>
            </tr>

            <tr>
                <td>user</td>
                <td>pwd</td>
            </tr>
        </tbody>
    </table>
        </div>
        <form style="width: 200px">
          <div class="form-group">
            <label for="exampleInputEmail1">User</label>
            <input type="text" class="form-control" id="exampleInputEmail1" placeholder="user">
          </div>
          <div class="form-group">
            <label for="exampleInputPassword1">Password</label>
            <input type="password" class="form-control" id="exampleInputPassword1" placeholder="password">
          </div>
          <button type="submit" class="btn btn-default">Login</button>
        </form>

        <hr>
        <div class="rows">
            <div class="col-xs-4">
        <form class="form-horizontal">
            <div class="form-group glyphicon glyphicon-menu-hamburger">
                <label for="inputEmail3" class="col-sm-2 control-label">User</label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control"  placeholder="user">
                    </div>
            </div>

            <div class="form-group">
                <label for="inputPassword3" class="col-sm-2 control-label">Password</label>
                    <div class="col-sm-10">
                        <input type="password" class="form-control" id="inputPassword3" placeholder="password">
                    </div>
            </div>

            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <div class="checkbox">
                    <label>
                        <input type="checkbox"> Remember me
                    </label>
                </div>
            </div>

          </div>
            <div class="form-group">
                <div class="col-sm-offset-2 col-sm-10">
                    <button type="submit" class="btn btn-default">Sign in</button>
                </div>
            </div>
        </form>

        </div>
    </div>
    </div>
    <hr>
            <p class="bg-success">字体颜色字体颜色字体颜色字体颜色字体颜色</p>
            <p class="bg-info">字体颜色字体颜色字体颜色字体颜色字体颜色</p>
            <p class="bg-warning">字体颜色字体颜色字体颜色字体颜色字体颜色</p>
            <p class="bg-danger">字体颜色字体颜色字体颜色字体颜色字体颜色</p>

    <hr>
            <p class="text-muted">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
            <p class="text-primary">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
            <p class="text-success">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
            <p class="text-info">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
            <p class="text-warning">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
            <p class="text-danger">字体颜色字体颜色字体颜色字体颜色字体颜色...</p>
</body>
</html>